import React, { useState, useEffect } from 'react';
import { Space, Table, Switch, Tag, Input } from 'antd';
import { connect } from 'umi';
import './index.less';
function index(props: any) {
  console.log('====================================');
  console.log(props, 'props');
  console.log('====================================');

  const { Search } = Input;
  useEffect(() => {

    props.dispatch({ type: 'index/second_house' });
  }, []);
  const columns: any = [
    {
      title: 'ID',
      dataIndex: 'id',
      key: 'id',
      //   render: (text: any) => <a>{text}</a>,
    },
    {
      title: '小区名称',
      dataIndex: 'estate_name',
      key: 'estate_name',
    },
    {
      title: '标题',
      dataIndex: 'title',
      key: 'title',
    },
    {
      title: '面积',
      key: 'living_room',
      dataIndex: 'living_room',
      render: (item: any) => {
        return item == 0 ? (
          <span>待定</span>
        ) : item < 10 ? (
          <span>{item}万/套</span>
        ) : (
          <span>{item}元/㎡</span>
        );
      },
    },
    {
      title: '总价',
      dataIndex: 'price',
      key: 'price',
      render: (item: any) => {
        return <span>{item}万</span>;
      },
    },
    {
      title: '状态',
      dataIndex: 'status',
      render: (item: any) => {
        return (
          <Switch
            defaultChecked
            checkedChildren="正常"
            unCheckedChildren="关闭"
            onChange={(checked: any) => {
              console.log('====================================');
              console.log(checked);
              console.log('====================================');
            }}
          />
        );
      },
    },
    {
      title: 'Action',
      key: 'action',
      render: (_: any, record: any) => (
        <Space size="middle">
          <Space size={[0, 8]} wrap>
            <Tag style={{ backgroundColor: '#009688', color: '#fff' }}>
              编辑
            </Tag>
            <Tag style={{ backgroundColor: '#FF5722', color: '#fff' }}>
              删除
            </Tag>
          </Space>
        </Space>
      ),
    },
  ];

  return (
    <div>
      <Search
        placeholder="input search text"
        allowClear
        enterButton="Search"
        size="large"
        onSearch={(val: any) => {
          props.dispatch({ type: 'index/second_Seach', payload: val });
        }}
      />
      <Table
        columns={columns}
        dataSource={props.fang_second_house}
        size="middle"
      />
      ;
    </div>
  );
}
const mapStateToProps = ({ index }: any) => {
  // console.log('====================================');
  // console.log(state.index.fang_second_house);
  // console.log('====================================');
  return index;
};
export default connect(mapStateToProps)(index);
